<template>
    <div>
        <div class="page-title">修改任务</div>
        <el-row>
            <el-col :span="3">
                <el-button type="primary" @click="submit()">下达任务</el-button>
            </el-col>
            <el-col :span="8">
                <el-date-picker
                v-model="updateCheckDate.startDate"
                placeholder="选择开始日期"
                value-format="yyyy-MM-dd" 
                format="yyyy-MM-dd"
                style="width:40%"
                @change="updateStartDate">
                </el-date-picker>
                <span style="width:20%">-</span>
                <el-date-picker
                v-model="updateCheckDate.endDate"
                placeholder="选择结束日期"
                value-format="yyyy-MM-dd" 
                format="yyyy-MM-dd"
                style="width:40%"
                @change="updateEndDate">
                </el-date-picker>
            </el-col>
        </el-row>
        <div class="page-content">
            <el-form label-width="120px" :model="formData" ref="formData" style="width:100%">
                <div>
                    <el-tag type="success">任务队</el-tag>
                    <el-select @change="getNewTeam" v-model="formData.groupName1" placeholder="请选择添加任务地区" size="mini">
                        <el-option v-for="item in formData.groups" :value="item.name" :key="item.dictCode"
                            :label="item.name">
                        </el-option>
                    </el-select>
                    <el-select  v-model="formData.newWork"   placeholder="请选择添加任务" size="mini" value-key="supervisionAreaCompanyID">
                        <el-option v-for="item in newWork.Team" :value="item" :key="item.supervisionAreaCompanyID"
                            :label="item.taskItem">
                        </el-option>
                    </el-select>
                    <el-button type="primary" size="mini" @click="kankan1()">确认添加</el-button>
                    <el-table height="350"
                        :data="postData.tableTeam"
                        style="width: 100%">
                        <el-table-column label="地区" prop="areaName">
                        </el-table-column>
                        <el-table-column label=姓名 prop="staffName">
                        </el-table-column>
                        <el-table-column label=作业队 prop="taskItem">
                        </el-table-column>
                        <el-table-column label=监督次数>
                            <template slot-scope="scope">
                                <el-input-number v-model="scope.row.plannedInspectionTimes"
                                    @change="handleChange(scope.$index, scope.row)" :min="0" :max="10" label="描述文字">
                                </el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column align="right">
                        </el-table-column>
                    </el-table>
                    <el-tag type="success">生产辅助班组</el-tag>
                    <el-select @change="getNewGroup" v-model="formData.groupName2" placeholder="请选择添加任务地区" size="mini">
                        <el-option v-for="item in formData.groups" :value="item.name" :key="item.dictCode"
                            :label="item.name">
                        </el-option>
                    </el-select>
                    <el-select  v-model="formData.newGroup"   placeholder="请选择添加任务" size="mini" value-key="supervisionAreaCompanyID">
                        <el-option v-for="item in newWork.Groups" :value="item" :key="item.supervisionAreaCompanyID"
                            :label="item.taskItem">
                        </el-option>
                    </el-select>
                    <el-button type="primary" size="mini" @click="kankan2()">确认添加</el-button>
                    <el-table max-height="250"
                        :data="postData.tableGroup"
                        style="width: 100%">

                        <el-table-column label="地区" prop="areaName">
                        </el-table-column>
                        <el-table-column label=姓名 prop="staffName">
                        </el-table-column>
                        <el-table-column label=辅助班组 prop="taskItem">
                        </el-table-column>
                        <el-table-column label=监督次数>
                            <template slot-scope="scope">
                                <el-input-number v-model="scope.row.plannedInspectionTimes"
                                    @change="handleChange(scope.$index, scope.row)" :min="0" :max="10" label="描述文字">
                                </el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column align="right">
                            <template slot="header">
                            </template>

                        </el-table-column>
                    </el-table>



                    <el-tag type="success">重点部位</el-tag>
                    <el-select @change="getNewLocation" v-model="formData.groupName3" placeholder="请选择添加任务地区" size="mini">
                        <el-option v-for="item in formData.groups" :value="item.name" :key="item.dictCode"
                            :label="item.name">
                        </el-option>
                    </el-select>
                    <el-select  v-model="formData.newLocation"   placeholder="请选择添加任务" size="mini" value-key="supervisionAreaCompanyID">
                        <el-option v-for="item in newWork.location" :value="item" :key="item.supervisionAreaCompanyID"
                            :label="item.taskItem">
                        </el-option>
                    </el-select>
                    <el-button type="primary" size="mini" @click="kankan3()">确认添加</el-button>
                    <el-table max-height="250"
                        :data="postData.tableLocation"
                        style="width: 100%">

                        <el-table-column label="地区" prop="areaName">
                        </el-table-column>
                        <el-table-column label=姓名 prop="staffName">
                        </el-table-column>
                        <el-table-column label=重点部位 prop="taskItem">
                        </el-table-column>
                        <el-table-column label=监督次数>
                            <template slot-scope="scope">
                                <el-input-number v-model="scope.row.plannedInspectionTimes"
                                    @change="handleChange(scope.$index, scope.row)" :min="0" :max="10" label="描述文字">
                                </el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column align="right">
                            <template slot="header">
                            </template>

                        </el-table-column>
                    </el-table>




                    <el-tag type="success">关键环节</el-tag>
                    <el-table max-height="250"
                        :data="postData.tableKey"
                        style="width: 100%">

                        <el-table-column label="关键环节" prop="taskItem">
                        </el-table-column>
                        <el-table-column label=姓名 prop="staffName">
                        </el-table-column>
                        <el-table-column label=监督次数>
                            <template slot-scope="scope">
                                <el-input-number v-model="scope.row.plannedInspectionTimes"
                                    @change="handleChange(scope.$index, scope.row)" :min="0" :max="10" label="描述文字">
                                </el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column align="right">
                            <template slot="header">
                            </template>
                        </el-table-column>
                    </el-table>


                    <el-tag type="success">专项检查</el-tag>
                    <el-table max-height="250"
                        :data="postData.tableCheck"
                        style="width: 100%">

                        <el-table-column label="检查专项" prop="taskItem">
                        </el-table-column>
                        <el-table-column label=姓名 prop="staffName">
                        </el-table-column>
                        <el-table-column label=监督次数>
                            <template slot-scope="scope">
                                <el-input-number v-model="scope.row.plannedInspectionTimes"
                                    @change="handleChange(scope.$index, scope.row)" :min="0" :max="10" label="描述文字">
                                </el-input-number>
                            </template>
                        </el-table-column>
                        <el-table-column align="right">
                            <template slot="header">

                            </template>

                        </el-table-column>
                    </el-table>
                </div>
            </el-form>
        </div>
    </div>
</template>


<script>
    import {
         getGroups,
         getWork2,
         getNewWork,
         postWork2
    } from '../../../services/task_issue'
   
    export default {
        mounted() {
            this.getGroupName()
            this.taskRow = this.$route.params.taskRow
            this.postData.tip = this.$route.params.tip
            this.kan()
            this.getTeam()
            this.getGroup()
            this.getLocation()
            this.getKey()
            this.getCheck()
            this.getCheckDate()
           // this.handleChange1()
        },
        methods: {
            
            getGroupName() {
                getGroups().then((res) => {
                    this.formData.groups = res.data
                }).catch((err) => {
                    this.$message.error(err.message)
                })
            },
            //获取任务队
            getNewTeam() {
                this.getNewWork1.areaName = this.formData.groupName1
                this.getNewWork1.taskType = '作业队'
                this.getNewWork1.supervisionTaskCode = this.taskRow.supervisionTaskCode
                getNewWork(this.getNewWork1).then((res) => {
                    this.newWork.Team = res.data
                })
            },
            // getNewTeam(){
            //     this.getNewWork1.taskType="作业队"
                
            //   //  console.log(this.getNewWork1)
            //   if(this.formData.groupName1 === "陇东")
            //   {
            //     getNewWork(this.getNewWork1).then((res) => {
            //         this.newWork.Team = res.location1
            //         this.newWork.Team.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Team)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName1 === "环江")
            //   {
            //     getNewWork(this.getNewWork1).then((res) => {
            //         this.newWork.Team = res.location2
            //         this.newWork.Team.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Team)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName1 === "定边")
            //   {
            //     getNewWork(this.getNewWork1).then((res) => {
            //         this.newWork.Team = res.location3
            //         this.newWork.Team.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Team)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName1 === "靖吴")
            //   {
            //     getNewWork(this.getNewWork1).then((res) => {
            //         this.newWork.Team = res.location4
            //         this.newWork.Team.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Team)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            
            // },
            //获得辅助班组
            getNewGroup() {
                this.getNewWork2.areaName = this.formData.groupName2
                this.getNewWork2.taskType = '配属班组'
                this.getNewWork2.supervisionTaskCode = this.taskRow.supervisionTaskCode
                //console.log('getNewWork2',this.getNewWork2)
                getNewWork(this.getNewWork2).then((res) => {
                    this.newWork.Groups = res.data
                })
            },
            // getNewGroup(){
            //     this.getNewWork2.taskType="配属班组"
            //     console.log(this.getNewWork2)
            //   //  console.log(this.getNewWork1)
            //   if(this.formData.groupName2 === "陇东")
            //   {
            //     getNewWork(this.getNewWork2).then((res) => {
            //         this.newWork.Groups = res.location1
            //         this.newWork.Groups.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(res)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName2 === "环江")
            //   {
            //     getNewWork(this.getNewWork2).then((res) => {
            //         this.newWork.Groups = res.location2
            //         this.newWork.Groups.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Groups)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName2 === "定边")
            //   {
            //     getNewWork(this.getNewWork2).then((res) => {
            //         this.newWork.Groups = res.location3
            //         this.newWork.Groups.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Groups)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName2 === "靖吴")
            //   {
            //     getNewWork(this.getNewWork2).then((res) => {
            //         this.newWork.Groups = res.location4
            //         this.newWork.Groups.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.Groups)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            
            // },


            //获得重点要害部位
            getNewLocation() {
                this.getNewWork3.areaName = this.formData.groupName3
                this.getNewWork3.taskType = '重点要害部位及固定场所'
                this.getNewWork3.supervisionTaskCode = this.taskRow.supervisionTaskCode
                getNewWork(this.getNewWork3).then((res) => {
                    this.newWork.location = res.data
                })
            },
            // getNewLocation(){
            //     this.getNewWork3.taskType="重点要害部位及固定场所"
            //     console.log(this.getNewWork3)
            //   //  console.log(this.getNewWork1)
            //   if(this.formData.groupName3 === "陇东")
            //   {
            //     getNewWork(this.getNewWork3).then((res) => {
            //         this.newWork.location = res.location1
            //         this.newWork.location.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
            //         console.log(this.newWork.location)
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName3 === "环江")
            //   {
            //     getNewWork(this.getNewWork3).then((res) => {
            //         this.newWork.location = res.location2
            //         this.newWork.location.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
                    
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName3 === "定边")
            //   {
            //     getNewWork(this.getNewWork3).then((res) => {
            //         this.newWork.location = res.location3
            //         this.newWork.location.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
                    
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            // if(this.formData.groupName3 === "靖吴")
            //   {
            //     getNewWork(this.getNewWork3).then((res) => {
            //         this.newWork.location = res.location4
            //         this.newWork.location.forEach(item => {
            // this.$set(item, 'plannedInspectionTimes', 1)
            // this.$set(item, 'staffName', this.taskRow.execStaffName)
            // })
                    
            //     }).catch((err) => {
            //         this.$message.error(err.message)
            //     })
            // }
            
            // },

            kan(){    
                this.getNewWork1.supervisionTaskCode=this.taskRow.supervisionTaskCode
                this.getNewWork2.supervisionTaskCode=this.taskRow.supervisionTaskCode
                this.getNewWork3.supervisionTaskCode=this.taskRow.supervisionTaskCode
            },
            kankan1(){
                this.formData.newWork.staffID=this.taskRow.execStaffID
                this.formData.newWork.staffName=this.taskRow.execStaffName
                this.formData.newWork.plannedInspectionTimes=1
                this.formData.newWork.actuaInspectionTimes=0
                this.postData.tableTeam = this.postData.tableTeam.concat(this.formData.newWork) 
                this.postData2.tableTeam = this.postData2.tableTeam.concat(this.formData.newWork) 
            },
            kankan2(){
              this.formData.newGroup.staffID=this.taskRow.execStaffID
                this.formData.newGroup.staffName=this.taskRow.execStaffName
                this.formData.newGroup.plannedInspectionTimes=1
                this.formData.newGroup.actuaInspectionTimes=0
              this.postData.tableGroup = this.postData.tableGroup.concat(this.formData.newGroup)
              this.postData2.tableGroup = this.postData2.tableGroup.concat(this.formData.newGroup)
              
           },
           kankan3(){
               this.formData.newLocation.staffID=this.taskRow.execStaffID
                this.formData.newLocation.staffName=this.taskRow.execStaffName
                this.formData.newLocation.plannedInspectionTimes=1
                this.formData.newLocation.actuaInspectionTimes=0
             this.postData.tableLocation = this.postData.tableLocation.concat(this.formData.newLocation)
             this.postData2.tableLocation = this.postData2.tableLocation.concat(this.formData.newLocation)
          },
            getTeam() {
                this.supervisionTaskCode.supervisionTaskCode=this.taskRow.supervisionTaskCode
                getWork2(this.supervisionTaskCode).then((res) => {
                    this.postData.tableTeam = res.team
                }).catch((err) => {
                    this.$message.error(err.message)
                })
            },
            getGroup() {
                getWork2(this.supervisionTaskCode).then((res) => {
                    this.postData.tableGroup = res.group
                }).catch((err) => {
                    this.$message.error(err.message)
                })
            },
            getLocation() {
                getWork2(this.supervisionTaskCode).then((res) => {
                    this.postData.tableLocation = res.location
                }).catch((err) => {
                    this.$message.error(err.message)
                })
            },
            getKey() {

                getWork2(this.supervisionTaskCode).then((res) => {
                    this.postData.tableKey = res.key
                    
                  //  this.postData.tableKey.forEach(item => {
                  //      this.$set(item, 'plannedInspectionTimes', 1)
                  //      this.$set(item, 'type', '关键环节')
                 //   })
                }).catch((err) => {
                    this.$message.error(err.message)
                })
            },
            getCheck() {
                getWork2(this.supervisionTaskCode).then((res) => {
                    this.postData.tableCheck = res.check
                    
                }).catch((err) => {
                    this.$message.error(err.message)
                })
            },
            submit() {
                this.postData.supervisionTaskCode = this.taskRow.supervisionTaskCode
                console.log('postData',this.postData)
                if(this.postData.startDate > this.postData.endDate) {
                    this.$message.error('结束日期在开始日期之前，请重新选择结束日期！')
                }
                else {
                    if(this.taskRow.status == '已接收' && 
                this.taskRow.receiveDate > this.updateCheckDate.endDate) {
                    this.$message.error('结束日期在接收日期之前，请重新选择结束日期！')
                    this.updateCheckDate.endDate = ''
                    this.postData.endDate = ''
                    this.postData2.endDate = ''
                }
                else {
                    this.postData.supervisionTaskCode=this.taskRow.supervisionTaskCode
                    postWork2(this.postData).then((res) => {
                        this.$message({
                        message: res.message,
                        type: 'success'
                    });
                    // this.$router.go(0);
                    }).catch((err) => {
                        this.$message.error(err.message);
                        })
                    }
                }
            },
            submit2(){
                if(this.postData2.startData > this.postData2.endData) {
                    this.$message.error('结束日期在开始日期之前，请重新选择结束日期！')
                }
                // this.postData2.startData=this.taskRow.startDate
                // this.postData2.endData=this.taskRow.endDate
                this.postData2.supervisionTaskCode=this.taskRow.supervisionTaskCode
                this.postData2.tip=this.postData.tip
                console.log(this.postData2)
                postWork2(this.postData2).then((res) => {
                    this.$message({
                        message: res.message,
                        type: 'success'
                    });
                    // this.$router.go(0);
                }).catch((err) => {
                    this.$message.error(err.message);
                })
        },
        getCheckDate() {
            this.updateCheckDate.startDate = this.taskRow.startDate
            this.updateCheckDate.endDate = this.taskRow.endDate
        },
        updateStartDate() {
            this.postData.startDate = this.updateCheckDate.startDate
            this.postData2.startData = this.updateCheckDate.startDate
        },
        updateEndDate() {
            this.postData.endDate = this.updateCheckDate.endDate
            this.postData2.endData = this.updateCheckDate.endDate
        }
        },

        data() {
            return {
                taskRow: [],
                supervisionTaskCode: {
                    supervisionTaskCode:''
                },
                getNewWork1:{
                    supervisionTaskCode: '',
                    taskType: "",
                    areaName: "",
                },
                getNewWork2:{
                    supervisionTaskCode: '',
                    taskType: "",
                    areaName: "",
                },
                getNewWork3:{
                    supervisionTaskCode: '',
                    taskType: "",
                    areaName: "",
                },
                formData: {
                    groupName1:'',
                    groupName2:'',
                    groupName3:'',
                    groups:[],
                    newWork:[],
                    newGroup:[],
                    newLocation:[]
                },
                Team:[],
                postData: {     
                    tip:'',             
                    supervisionTaskCode:'',
                    startDate:'',
                    endDate:'',
                    tableTeam: [],
                    tableGroup: [],
                    tableLocation: [],
                    tableKey: [],
                    tableCheck: [],
                },
                postData2: {     
                    tip:'',             
                    supervisionTaskCode:'',
                    startData:'',
                    endData:'',
                    tableTeam: [],
                    tableGroup: [],
                    tableLocation: [],
                    tableKey: [],
                    tableCheck: [],
                },
                newWork:{
                    Team:[],
                    Groups:[],
                    location:[]
                },
                updateCheckDate:{
                    startDate:'',
                    endDate:'',
                }
            };

        }

    }
</script>

<style>
    .el-checkbox {
        margin-left: 25px;
    }

    .cutting {
        padding: 0 0px 0px;
        margin: 20px 0px;
        line-height: 1px;
        border-left: 750px solid rgb(221, 221, 221);
        border-right: 750px solid rgb(221, 221, 221);
        text-align: center;
        height: 2px;
        width: 100%;
    }
</style>